<template>
  <div>
    <tableComponents
      :pagination="{currentPage,pageSize,total:list.all_num}"
      @handleCurrentChange="handleCurrentChange"
      @handleSizeChange="handleSizeChange"
      @sendUserSearch="receive_search"
      :searchData="userSearchData"
      :isHaveExport="false"
      :isHaveAdd="false"
    >
      <template v-slot:table>
        <el-table
          ref="multipleTable"
          :data="list.data"
          stripe
          v-loading="loading"
          header-row-class-name="head_color"
          tooltip-effect="dark"
          style="width: 99.8%"
        >
          <el-table-column label="礼物信息" min-width="150">
            <template slot-scope="scope">
              <div class="user_table">
                <span>礼物标题：</span>
                <small>{{scope.row.title || '----'}}</small>
                <br />
                <span>礼物价格：</span>
                <small>{{scope.row.price || '----'}}</small>
                <br />
              </div>
            </template>
          </el-table-column>
          <el-table-column label="订单号" min-width="180" align="center">
            <template slot-scope="scope">{{scope.row.oid}}</template>
          </el-table-column>

          <el-table-column label="用户信息" min-width="200">
            <template slot-scope="scope">
              <div class="user_table">
                <span>用户名：</span>
                <small>{{scope.row.username || '----'}}</small>
                <br />
                <span>用户昵称：</span>
                <small>{{scope.row.nickname || '----'}}</small>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="主播信息" min-width="200">
            <template slot-scope="scope">
              <div class="user_table">
                <span>用户名：</span>
                <small>{{scope.row.s_username || '----'}}</small>
                <br />
                <span>用户昵称：</span>
                <small>{{scope.row.s_nickname || '----'}}</small>
              </div>
            </template>
          </el-table-column>

          <el-table-column label="下单时间" min-width="200">
            <template slot-scope="scope">
              <div class="user_table">{{scope.row.created_time | getTimeFormat}}</div>
            </template>
          </el-table-column>
        </el-table>
      </template>
    </tableComponents>
  </div>
</template>
<script>
import HeadTitle from "@/components/currency/HeadTitle.vue";
import uploadpic from "@/components/page/pic/up_pic";
import search from "@/components/live/ordersearch";
import { liveOrderSearchData } from "@/assets/js/searchData/searchData"; //引入搜索的数据
export default {
  data() {
    return {
      userSearchData: liveOrderSearchData,
      current: "",
      loading: false,
      list: [],
      allPage: 0,
      allNum: 0,
      pageSize: 10,
      currentPage: 1,
      searchAll: {},
      row: {},

      showCity: true
    };
  },
  components: {
    HeadTitle,
    uploadpic,
    search
  },
  methods: {
    receive_search(obj) {
      this.searchAll = obj;
      this.getNewsAll(obj);
    },
    getNewsAll(data) {
      this.loading = true;
      var params = {};
      data = data || {};
      params = data;
      this.$api.getPage.get_liveorder(params).then(res => {
        if (res.data.code == 200) {
          this.list = res.data.result;
        }
        this.loading = false;
      });
    },
    handleSizeChange(val) {
      var params = this.searchAll;
      params.page = "";
      params.page_size = val;
      this.getNewsAll(params);
      this.pageSize = val;
    },
    handleCurrentChange(val) {
               this.currentPage = val;
      var params = this.searchAll;
      params.page = val;
      params.page_size = this.pageSize;
      this.getNewsAll(params);
    },

    reload() {
      this.getNewsAll(this.searchAll);
    }
  },
  beforeCreate() {},
  created() {
    this.getNewsAll();
  },
  computed: {}
};
</script>

<style lang="less" scoped>
.myblank button {
  margin: 5px 5px 0 0;
}
</style>
